<div class="d-flex justify-content-between align-items-center">
  <span class="d-block font-weight-bold text-info">
    <span *ngIf="filtered$ | async"
      >{{ 'enum.FOUND' | translate }} {{ filteredCount }}&nbsp;/
    </span>
    <span *ngIf="!(filtered$ | async)">
      {{ 'enum.OUT_OF' | translate }}&nbsp;
    </span>
    {{ rowData.length }}
  </span>
  <div class="d-flex justify-content-end align-items-center">
    <ng-container *appDisplayControl="'write_vuls_profile'">
      <button
        (click)="acceptVul()"
        *ngIf="selectedVulnerability"
        mat-stroked-button>
        <i class="eos-icons mr-2">done</i>{{ 'cveProfile.ACCEPT' | translate }}
      </button>
    </ng-container>
    <button
      [matMenuTriggerFor]="menu"
      class="mx-2 d-flex align-items-center justify-content-center<i class='eos-icons'>done</i>a"
      mat-button>
      {{ activeScore }} <i class="eos-icons">arrow_drop_down</i>
    </button>
    <mat-menu #menu="matMenu">
      <button (click)="changeScoreView('V2')" mat-menu-item>
        {{ 'scan.gridHeader.SCORE_V2' | translate }}
      </button>
      <button (click)="changeScoreView('V3')" mat-menu-item>
        {{ 'scan.gridHeader.SCORE_V3' | translate }}
      </button>
    </mat-menu>
    <button
      (click)="onToggleChartView()"
      aria-label="Pie chart view icon button "
      mat-icon-button>
      <i class="eos-icons">pie_chart</i>
    </button>
    <button
      (click)="openAdvancedFilter()"
      class="mx-2 d-flex justify-content-end align-items-center"
      mat-button>
      <i class="eos-icons">search</i>{{ 'general.ADV_FILTER' | translate }}
    </button>
    <app-quick-filter
      (filterCountChange)="filterCountChanged($event)"
      [gridOptions]="gridOptions"
      [showCount]="false">
    </app-quick-filter>
  </div>
</div>

<ag-grid-angular
  (window:resize)="onResize()"
  [gridOptions]="gridOptions"
  class="ag-theme-alpine"
  style="width: 100%; height: calc(100% - 70px)">
</ag-grid-angular>
